<template>
  <div>
     <div class="box">
        <pie-chart-1></pie-chart-1>
        <pie-chart-2></pie-chart-2>
        <pie-chart-3></pie-chart-3>
     </div>
      <div class="box">
        <line-chart-4></line-chart-4>
     </div>
     <div class="box">
        <bar-chart-1></bar-chart-1>
        <bar-chart-2></bar-chart-2>
     </div>
     <div class="box">
       <radar-chart-1></radar-chart-1>
       <word-clound></word-clound>
     </div>
     <div class="box">
        <login-chart></login-chart>
     </div>
  </div>
</template>

<script>
import PieChart1 from '@/views/charts/PieChart1.vue'
import PieChart2 from '@/views/charts/PieChart2.vue'
import PieChart3 from '@/views/charts/PieChart3.vue'
import LineChart4 from '@/views/charts/LineChart4.vue'
import BarChart1 from '@/views/charts/BarChart1.vue'
import BarChart2 from '@/views/charts/BarChart2.vue'
import RadarChart1 from '@/views/charts/RadarChart1.vue'
import WordClound from '../charts/WordClound.vue'
import LoginChart from '@/views/charts/LoginChart.vue'
export default {
  components:{PieChart1,PieChart2,PieChart3,LineChart4,BarChart1,BarChart2,RadarChart1,WordClound,LoginChart}
}
</script>

<style>
  .box{
    display:flex
  }
</style>